<template>
  <div>
    <div class="page-title">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: './index' }"
          >任务列表</el-breadcrumb-item
        >
        <el-breadcrumb-item>执行任务</el-breadcrumb-item></el-breadcrumb
      >
    </div>

    <div class="page-content">
      <el-form
        :model="hseAuditGroupForm"
        :rules="hseAuditGroupFormRules"
        ref="ruleForm"
        label-width="25%"
        label-position="left"
        style="width: 100%"
      >
        <el-row>
          <el-col :span="8">
            <el-form-item label="组内审核">
              <el-input
                v-model="hseAuditGroupForm.hseAuditStaffID"
                style="width: 80%"
                readonly
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="审核日期">
              <el-input
                v-model="hseAuditGroupForm.hseAuditDate"
                style="width: 80%"
                readonly
              ></el-input>
              <!-- <el-date-picker 
                            placeholder="请选择审核日期"
                            v-model="hseAuditGroupForm.hseAuditDate"
                            value-format="yyyy-MM-dd"
                            format="yyyy-MM-dd"
                            @change="getAuditDate"
                            type="date"
                            style="width: 80%"
                            clearable></el-date-picker> -->
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="审核类别">
              <el-input
                v-model="hseAuditGroupForm.hseAuditType"
                style="width: 80%"
                readonly
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="审核区域">
              <treeselect
                :multiple="false"
                :options="companytree"
                placeholder="请选择审核区域"
                v-model="hseAuditGroupForm.hseAuditCompany"
                @select="handleSelectCompany"
                style="width: 80%"
                clearable
              ></treeselect>
              <!-- <el-input
                            v-model="hseAuditGroupForm.hseAuditCompany" 
                            style="width: 80%"
                            disabled></el-input> -->
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="审核主题" prop="hseAuditTopic">
              <el-select
                placeholder="请选择审核主题"
                v-model="hseAuditGroupForm.hseAuditTopic"
                value-key="hseAuditSystemCode"
                @change="getHseTopic"
                style="width: 80%"
              >
                <el-option
                  v-for="item in hseAuditTopic"
                  :key="item.hseAuditSystemID"
                  :label="item.evalueItem"
                  :value="item"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="审核项" prop="hseAuditTopicItem">
              <el-select
                placeholder="请选择审核项"
                v-model="hseAuditGroupForm.hseAuditTopicItem"
                value-key="hseAuditSystemCode"
                @change="getAuditTopicItem"
                style="width: 80%"
                clearable
              >
                <el-option
                  v-for="item in hseAuditTopicItem"
                  :key="item.hseAuditSystemCode"
                  :label="item.evalueItem"
                  :value="item"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-row>
        <el-button type="primary" @click="getHseAuditSystem('ruleForm')"
          >生成检查单</el-button
        >
        <el-button type="danger" @click="returnIndex"> 返回任务列表 </el-button>
        <el-button
          v-if="!hiddenHseAuditSystem"
          type="primary"
          @click="hanleSubmit()"
          >提交录入问题</el-button
        >
      </el-row>

      <el-divider></el-divider>

      <el-row>
        <el-tabs
          :hidden="hiddenHseAuditSystem"
          v-model="hseAuditSystem"
          tab-position="left"
          @tab-click="getHseAuditContent()"
        >
          <el-tab-pane
            v-for="item in hseAuditSystemContent"
            :key="item.hseAuditSystemCode"
            :label="item.evalueItem.slice(0, 11) + '...'"
            :name="item.hseAuditSystemCode"
            style="width: 20px"
          >
          </el-tab-pane>
          <el-col :span="16">
            <el-table
              :data="hseAuditTopicTable"
              :header-cell-style="{ 'text-align': 'center' }"
              :cell-style="{ 'text-align': 'center' }"
              style="width: 98%"
              height="400px"
              border
            >
              <el-table-column label="评分项" prop="evalueItem" min-width="30%">
              </el-table-column>
              <el-table-column
                label="评分说明"
                prop="evalueDescritption"
                :show-overflow-tooltip="true"
                min-width="30%"
              >
              </el-table-column>
              <el-table-column label="现场执行" min-width="15%">
                <template slot-scope="scope">
                  <el-switch
                    v-model="scope.row.isProblem"
                    active-text="否"
                    inactive-text="是"
                    active-color="#ff4949"
                    inactive-color="#13ce66"
                  >
                  </el-switch>
                </template>
              </el-table-column>
              <el-table-column label="操作" min-width="15%">
                <template slot-scope="scope">
                  <el-button
                    type="primary"
                    size="mini"
                    :disabled="!scope.row.isProblem"
                    @click="handleEntry(scope.row)"
                    >录入</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
          </el-col>

          <!-- 我录入的问题 -->
          <el-col :span="8">
            <el-table
              :data="entriedTableData"
              :header-cell-style="{
                'text-align': 'center',
                background: '#FFFFFF',
              }"
              :cell-style="{ 'text-align': 'center' }"
              height="400px"
              style="width: 100%"
              border
            >
              <el-table-column label="已录入的问题">
                <el-table-column
                  label="审核内容"
                  prop="auditContent"
                  min-width="60%"
                  :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column label="操作" min-width="40%">
                  <template slot-scope="scope">
                    <el-button
                      size="mini"
                      type="warning"
                      icon="el-icon-edit"
                      @click="handleExamine(scope.row)"
                    ></el-button>
                    <!-- <el-button size="mini" type="warning" @click="handleEdit(scope.row)">修改</el-button> -->
                    <el-button
                      size="mini"
                      type="danger"
                      icon="el-icon-delete"
                      @click="handleDelete(scope.row)"
                    ></el-button>
                  </template>
                </el-table-column>
              </el-table-column>
            </el-table>
          </el-col>
        </el-tabs>
      </el-row>
      <!-- 问题录入弹窗 -->
      <el-dialog
        :visible.sync="entryDialogVisible"
        title="问题详情"
        style="width: 2000px; height: 800px; left: -20%; top: 0%"
      >
        <div style="height: 50vh; width: 100%; overflow: auto">
          <el-form
            :model="hseAuditProblemForm"
            ref="hseAuditProblemFormRef"
            :rules="hseAuditProblemFormRules"
            label-width="100px"
            label-position="right"
            style="width: 100%"
          >
            <el-row>
              <el-col :span="12">
                <el-form-item label="组内审核">
                  <el-input
                    v-model="hseAuditProblemForm.internalAuditorName"
                    style="width: 50%"
                    readonly
                  >
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="审核时间">
                  <el-input
                    v-model="hseAuditProblemForm.auditTime"
                    style="width: 50%"
                    readonly
                  ></el-input>
                  <!-- <el-date-picker
                                placeholder="请选择审核时间"
                                v-model="hseAuditProblemForm.audittime"
                                value-format="yyyy-MM-dd"
                                format="yyyy-MM-dd"
                                style="width: 50%"
                                clearable>
                                </el-date-picker> -->
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="受检单位">
                  <!-- <el-select
                                placeholder="请选择受检单位"
                                v-model="hseAuditProblemForm.companyName"
                                value-key="companyCode"
                                @change="getCompany"
                                style="width: 50%"
                                clearable>
                                    <el-option 
                                    v-for="item in companyData"
                                    :key="item.companyCode"
                                    :label="item.companyName"
                                    :value="item"></el-option>
                                </el-select> -->
                  <el-input
                    v-model="hseAuditProblemForm.companyName"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="轮次">
                  <el-input
                    v-model="hseAuditProblemForm.round"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="问题描述" prop="audDescription">
                  <el-input
                    v-model="hseAuditProblemForm.audDescription"
                    type="textarea"
                    style="width: 78%"
                    clearable
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="判定依据" prop="judgmentBasis">
                  <el-input
                    type="textarea"
                    v-model="hseAuditProblemForm.judgmentBasis"
                    style="width: 78%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item
                  label="QHSEE管理体系要素"
                  prop="qhseeManagementFactor"
                >
                  <el-input
                    v-model="hseAuditProblemForm.qhseeManagementFactor"
                    style="width: 78%"
                    clearable
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="涉及要素" prop="elementsInvolved">
                  <el-input
                    v-model="hseAuditProblemForm.elementsInvolved"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="审核主题">
                  <el-input
                    v-model="hseAuditProblemForm.auditSubject"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="审核项">
                  <el-input
                    v-model="hseAuditProblemForm.auditItem"
                    style="width: 78%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="审核内容">
                  <el-input
                    v-model="hseAuditProblemForm.auditContent"
                    type="textarea"
                    style="width: 78%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="评分项">
                  <el-input
                    v-model="hseAuditProblemForm.scoringItems"
                    type="textarea"
                    style="width: 78%"
                    readonly
                  >
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="问题级别" prop="questionLevel">
                  <el-select
                    placeholder="请选择问题级别"
                    v-model="hseAuditProblemForm.questionLevel"
                    style="width: 50%"
                    clearable
                  >
                    <el-option
                      v-for="item in problemLevel"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="原因分析" prop="causeAnalysis">
                  <el-select
                    placeholder="请选择问题原因"
                    v-model="hseAuditProblemForm.causeAnalysis"
                    style="width: 50%"
                    clearable
                  >
                    <el-option
                      v-for="item in problemCause"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="隐患级别" prop="problemLevel">
                  <el-select
                    placeholder="请选择隐患级别"
                    v-model="hseAuditProblemForm.problemLevel"
                    style="width: 50%"
                    clearable
                  >
                    <el-option
                      v-for="item in dangerLevel"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="审核类别">
                  <el-input
                    v-model="hseAuditProblemForm.classify"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="整改建议" prop="rectificationSuggestions">
                  <el-input
                    v-model="hseAuditProblemForm.rectificationSuggestions"
                    type="textarea"
                    style="width: 78%"
                    clearable
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="责任人" prop="responsePersonName">
                  <el-select
                    placeholder="输入姓名搜索"
                    v-model="hseAuditProblemForm.responsePersonName"
                    value-key="employeeID"
                    @change="getresponsePerson"
                    style="width: 50%"
                    filterable
                    clearable
                  >
                    <el-option
                      v-for="item in employees"
                      :key="item.employeeID"
                      :label="item.name + '(' + item.station + ' | ' + item.companyName + ')'"
                      :value="item"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="整改责任人" prop="rectPersonName">
                  <el-select
                    placeholder="输入名字搜索"
                    v-model="hseAuditProblemForm.rectPersonName"
                    value-key="employeeID"
                    @change="getRectPerson"
                    style="width: 50%"
                    filterable
                    clearable
                  >
                    <el-option
                      v-for="item in employees"
                      :key="item.employeeID"
                      :label="item.name + '(' + item.station + ' | ' + item.companyName + ')'"
                      :value="item"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="扣分" prop="lostScore">
                  <el-input
                    placeholder="请输入分数"
                    v-model="hseAuditProblemForm.lostScore"
                    type="number"
                    style="width: 50%"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="检查人">
                  <el-input
                    v-model="hseAuditProblemForm.checkerName"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-form-item
                :label="checkAttachLabel"
                style="white-space: pre-line"
              >
                <el-upload
                  ref="upload"
                  :action="`/api/file_upload`"
                  list-type="picture-card"
                  :limit="4"
                  accept=".png, .jpg, .bmp, .tif, .gif, .jpeg"
                  :headers="{ Authorization: currentUser.token }"
                  :before-upload="beforeAttachUpload"
                  :on-remove="handleRemoveCheckAttach"
                  :auto-upload="true"
                  :on-success="handleSuccessCheckAttach"
                  :file-list="checkAttachFileList"
                >
                  <i class="el-icon-plus"></i>
                </el-upload>
                <el-dialog :visible.sync="dialogVisible">
                  <img width="100%" :src="dialogImageUrl" alt="" />
                </el-dialog>
              </el-form-item>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="问题视频">
                  <el-upload
                    ref="upload"
                    v-model="hseAuditProblemForm.checkVideo"
                    :headers="{ Authorization: currentUser.token }"
                    :action="`/api/file_upload`"
                    :auto-upload="true"
                    :limit="1"
                    accept=".mp4, .qlv, .qsv, .ogg, .flv, .avi, .wmv, .rmvb"
                    list-type="text"
                    :before-upload="beforeAttachUpload"
                    :on-remove="handleRemoveCheckVideo"
                    :on-success="handleSuccessCheckVideo"
                  >
                    <el-button size="small" type="primary">点击上传</el-button>
                    <div slot="tip" style="padding-right: 20px">
                      只能上传mp4、avi、flash、rmvb、rm格式，且不大于12M的视频。
                    </div>
                  </el-upload>
                </el-form-item>
              </el-col>
              <el-col :span="16">
                <el-card
                  :body-style="{ padding: '10px' }"
                  style="width: 400px; height: 200px; text-align: center"
                >
                  <span v-if="!hseAuditProblemForm.checkVideo && !checkVideoUrl"
                    >无视频文件记录！</span
                  >
                  <video
                    v-else-if="hseAuditProblemForm.checkVideo"
                    width="100%"
                    height="180"
                    controls
                    preload="none"
                    :src="checkVideoUrl"
                  ></video>
                  <video
                    v-else
                    width="100%"
                    height="180"
                    controls
                    preload="none"
                    :src="hseAuditProblemForm.checkVideo"
                  ></video>
                </el-card>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <span slot="footer">
          <el-button @click="entryDialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="handleAddRecord()">确 定</el-button>
        </span>
      </el-dialog>

      <!--修改录入问题详情-->
      <el-dialog
        :visible.sync="examineVisibleDialog"
        title="问题详情"
        style="width: 2000px; height: 800px; left: -20%; top: 0%"
      >
        <div style="height: 50vh; width: 100%; overflow: auto">
          <el-form
            :model="examineForm"
            ref="examineFormRef"
            :rules="hseAuditProblemFormRules"
            label-width="100px"
            label-position="right"
            style="width: 100%"
          >
            <el-row>
              <el-col :span="12">
                <el-form-item label="组内审核">
                  <el-input
                    v-model="examineForm.internalAuditorName"
                    style="width: 50%"
                    readonly
                  >
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="审核时间">
                  <el-input
                    v-model="examineForm.auditTime"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="受检单位">
                  <!-- <el-input
                    v-if="examineForm.companyName !== undefined"
                    v-model="examineForm.companyName"
                    style="width: 50%"
                    readonly
                  ></el-input>
                  <el-input
                    v-else-if="examineForm.basicCompanyName !== undefined"
                    v-model="examineForm.basicCompanyName"
                    style="width: 50%"
                    readonly
                  ></el-input>
                  <el-input
                    v-else
                    v-model="examineForm.parentCompanyName"
                    style="width: 50%"
                    readonly
                  ></el-input> -->
                  <el-input
                    v-model="examineForm.companyName"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="轮次">
                  <el-input
                    v-model="examineForm.round"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="问题描述" prop="audDescription">
                  <el-input
                    v-model="examineForm.audDescription"
                    type="textarea"
                    style="width: 78%"
                    clearable
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="判定依据" prop="judgmentBasis">
                  <el-input
                    type="textarea"
                    v-model="examineForm.judgmentBasis"
                    style="width: 78%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item
                  label="QHSEE管理体系要素"
                  prop="qhseeManagementFactor"
                >
                  <el-input
                    v-model="examineForm.qhseeManagementFactor"
                    style="width: 78%"
                    clearable
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="涉及要素" prop="elementsInvolved">
                  <el-input
                    v-model="examineForm.elementsInvolved"
                    style="width: 50%"
                    clearable
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="审核主题">
                  <el-input
                    v-model="examineForm.auditSubject"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="审核项">
                  <el-input
                    v-model="examineForm.auditItem"
                    style="width: 78%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="审核内容">
                  <el-input
                    v-model="examineForm.auditContent"
                    type="textarea"
                    style="width: 78%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="评分项">
                  <el-input
                    v-model="examineForm.scoringItems"
                    type="textarea"
                    style="width: 78%"
                    readonly
                  >
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="问题级别" prop="questionLevel">
                  <el-select
                    placeholder="请选择问题级别"
                    v-model="examineForm.questionLevel"
                    style="width: 50%"
                    clearable
                  >
                    <el-option
                      v-for="item in problemLevel"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="原因分析" prop="causeAnalysis">
                  <el-select
                    placeholder="请选择问题原因"
                    v-model="examineForm.causeAnalysis"
                    style="width: 50%"
                    clearable
                  >
                    <el-option
                      v-for="item in problemCause"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="隐患级别" prop="problemLevel">
                  <el-select
                    placeholder="请选择隐患级别"
                    v-model="examineForm.problemLevel"
                    style="width: 50%"
                    clearable
                  >
                    <el-option
                      v-for="item in dangerLevel"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="审核类别">
                  <el-input
                    v-model="examineForm.classify"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="整改建议" prop="rectificationSuggestions">
                  <el-input
                    v-model="examineForm.rectificationSuggestions"
                    type="textarea"
                    style="width: 78%"
                    clearable
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="责任人" prop="responsePersonName">
                  <el-select
                    placeholder="输入姓名搜索"
                    v-model="examineForm.responsePersonName"
                    value-key="employeeID"
                    @change="updateResponsePerson"
                    style="width: 50%"
                    filterable
                    clearable
                  >
                    <el-option
                      v-for="item in employees"
                      :key="item.employeeID"
                      :label="item.name + '(' + item.station + ' | ' + item.companyName + ')'"
                      :value="item"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="整改责任人" prop="rectPersonName">
                  <el-select
                    placeholder="输入名字搜索"
                    v-model="examineForm.rectPersonName"
                    @change="updateRectPerson"
                    value-key="employeeID"
                    style="width: 50%"
                    filterable
                    clearable
                  >
                    <el-option
                      v-for="item in employees"
                      :key="item.employeeID"
                      :label="item.name + '(' + item.station + ' | ' + item.companyName + ')'"
                      :value="item"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="扣分" prop="lostScore">
                  <el-input
                    placeholder="请输入分数"
                    v-model="examineForm.lostScore"
                    type="number"
                    style="width: 50%"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="检查人">
                  <el-input
                    v-model="examineForm.checkerName"
                    style="width: 50%"
                    readonly
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="检查图片">
                  <el-upload
                    ref="updateCheckAttachRef"
                    :action="`/api/file_upload`"
                    :on-preview="beforeAttachUpload"
                    :on-remove="handleRemoveUpdateCheckAttach"
                    :file-list="updateCheckAttachFileList"
                    :on-success="updateSuccessCheckAttach"
                    :limit="4"
                    list-type="picture"
                  >
                    <el-button type="primary" size="small">点击上传</el-button>
                    <span v-if="!examineForm.checkAttach1">暂无检查图片！</span>
                    <div slot="tip" class="el-upload__tip">
                      最多上传4张图片，每张图片不能超过12MB！
                    </div>
                  </el-upload>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-form-item label="问题视频：">
                <el-row>
                  <el-col :span="8">
                    <el-upload
                      v-model="examineForm.checkVideo"
                      :action="`/api/file_upload`"
                      :auto-upload="true"
                      :limit="1"
                      :headers="{ Authorization: currentUser.token }"
                      accept=".mp4, .qlv, .qsv, .ogg, .flv, .avi, .wmv, .rmvb"
                      :before-upload="beforeAttachUpload"
                      :on-remove="UpdateRemoveCheckVideo"
                      :on-success="UpdateSuccessCheckVideo"
                      list-type="text"
                    >
                      <el-button size="small" type="primary"
                        >点击上传</el-button
                      >
                      <div slot="tip" style="padding-right: 20px">
                        只能上传mp4、avi、flash、rmvb、rm格式，且不大于12M的视频。
                      </div>
                    </el-upload>
                  </el-col>
                  <el-col :span="16">
                    <el-card
                      :body-style="{ padding: '10px' }"
                      style="width: 400px; height: 200px; text-align: center"
                    >
                      <span v-if="!examineForm.checkVideo"
                        >未上传视频文件！</span
                      >
                      <video
                        v-else-if="examineForm.checkVideo"
                        width="100%"
                        height="180"
                        controls
                        preload="none"
                        :src="examineForm.checkVideo"
                      ></video>
                      <video
                        v-else
                        width="100%"
                        height="180"
                        controls
                        preload="none"
                        :src="updateCheckVideoUrl"
                      ></video>
                    </el-card>
                  </el-col>
                </el-row>
              </el-form-item>
            </el-row>
          </el-form>
        </div>
        <span slot="footer">
          <el-button @click="examineVisibleDialog = false">取 消</el-button>
          <el-button type="primary" @click="updateProblem">确 定</el-button>
        </span>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import { GetDictionary } from "../../../services/dictionary";
import { GetCompany } from "../../../services/gettreedata";
import {
  GetHSEAuditGroupMember,
  GetHSEAuditGroupTopic,
  GetHseAuditTopicItem,
  GetHSEAuditSystem,
  AddHSECheckRecord,
  GetAuditSubjectRecord,
  DeleteCheckRecord,
  UpdateHSECheckRecord,
  GetLoginPerson,
  UploadURL,
  SubmitHSEEntried,
} from "../../../services/hseAudit";
import { GetCurrentUser } from "../../../store/CurrentUser";

export default {
  data() {
    return {
      hseAuditGroupForm: {
        hseAuditStaffID: "",
        hseAuditDate: "",
        hseAuditType: "",
        hseAuditCompany: "01",
        hseAuditTopic: "",
        hseAuditTopicItem: "",
      },
      hseAuditGroupFormRules: {
        hseAuditTopic: [
          { required: true, message: "请选择审核主题", trigger: "change" },
        ],
        hseAuditTopicItem: [
          { required: true, message: "请选择审核主题", trigger: "change" },
        ],
      },
      employees: [],
      checkList: [],
      auditContentTable: [],
      hseAuditSystem: "",
      hseAuditSystemContent: [],
      hiddenHseAuditSystem: true,
      hseAuditTopic: [],
      hseAuditTopicItem: [],
      hseAuditTopicTable: [],
      disabled: true,
      entryDialogVisible: false,
      dialogVisible: false,
      updateDialogVisible: false,
      dialogImageUrl: "",
      updateDialogImageUrl: "",
      checkAttachLabel: `问题图片：\n最多上传四\n张图片，且\n每一张大小\n不超过12M!`,
      checkAttachFileList: [],
      updateCheckAttachFileList: [],
      checkVideoUrl: "",
      updateCheckVideoUrl: "",
      hseAuditProblemForm: {
        auditGroupID: "",
        auditGroupName: "",
        qhseeCheckRecordID: "",
        internalAuditorID: "",
        internalAuditorName: "",
        auditTime: "",
        companyCode: "",
        companyName: "",
        round: "",
        audDescription: "",
        judgmentBasis: "",
        qhseeManagementFactor: "",
        elementsInvolved: "",
        auditSubject: "",
        auditItem: "",
        questionLevel: "",
        causeAnalysis: "",
        problemLevel: "",
        classify: "",
        rectificationSuggestions: "",
        lostScore: "",
        checkerID: "",
        checkerName: "",
        responsePersonID: "",
        responsePersonName: "",
        rectPersonID: "",
        rectPersonName: "",
        checkAttach1: "",
        checkAttach2: "",
        checkAttach3: "",
        checkAttach4: "",
        checkVideo: "",
        scoringItems: "",
        recordStatus: "",
      },
      hseAuditProblemFormRules: {
        audDescription: [
          { required: true, message: "请输入问题描述", trigger: "blur" },
        ],
        judgmentBasis: [],
        qhseeManagementFactor: [],
        elementsInvolved: [],
        questionLevel: [
          { required: true, message: "请选择问题级别", trigger: "change" },
        ],
        causeAnalysis: [
          { required: true, message: "请选择问题原因", trigger: "change" },
        ],
        problemLevel: [
          { required: true, message: "请选择隐患级别", trigger: "change" },
        ],
        rectificationSuggestions: [
          { required: true, message: "请输入整改建议", trigger: "blur" },
        ],
        responsePersonName: [
          { required: true, message: "请选择责任人", trigger: "change" },
        ],
        rectPersonName: [
          { required: true, message: "请选择整改责任人", trigger: "change" },
        ],
        lostScore: [{ required: true, message: "请输入分数", trigger: "blur" }],
      },
      // companyData: [],
      checkType: [],
      problemLevel: [],
      dangerLevel: [],
      problemCause: [],
      entriedTableData: [],
      subjectData: {
        staffID: "",
        auditSubject: "",
        auditItem: "",
        auditTime: "",
      },
      companytree: [],
      examineVisibleDialog: false,
      examineForm: {
        qhseeCheckRecordID: "",
        internalAuditorID: "",
        internalAuditorName: "",
        auditTime: "",
        companyCode: "",
        companyName: "",
        round: "",
        audDescription: "",
        judgmentBasis: "",
        qhseeManagementFactor: "",
        elementsInvolved: "",
        auditSubject: "",
        auditItem: "",
        questionLevel: "",
        causeAnalysis: "",
        problemLevel: "",
        classify: "",
        rectificationSuggestions: "",
        lostScore: "",
        checkerID: "",
        checkerName: "",
        responsePersonID: "",
        responsePersonName: "",
        rectPersonID: "",
        rectPersonName: "",
        checkAttach1: "",
        checkAttach2: "",
        checkAttach3: "",
        checkAttach4: "",
        checkVideo: "",
        scoringItems: "",
        recordStatus: "",
      },
      companyData: {},
      rowData: {},
      type: "",
      submitTable: [],
    };
  },
  mounted() {
    this.handleGet();
  },
  computed: {
    currentUser() {
      return GetCurrentUser();
    },
  },
  methods: {
    handleGet() {
      var date = new Date();
      this.rowData = JSON.parse(this.$route.query.row);
      var month = date.getMonth() + 1;
      this.hseAuditGroupForm.hseAuditDate =
        date.getFullYear() + "-" + month + "-" + date.getDate();
      this.hseAuditGroupForm.hseAuditType = this.rowData.groupType;
      this.hseAuditGroupForm.hseAuditStaffID = this.rowData.groupLeaderName;
      GetDictionary({ name: "检查类型" })
        .then((res) => {
          this.checkType = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      GetDictionary({ name: "QHSEE问题级别" })
        .then((res) => {
          this.problemLevel = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      GetDictionary({ name: "QHSEE隐患级别" })
        .then((res) => {
          this.dangerLevel = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      GetDictionary({ name: "QHSEE原因分析" })
        .then((res) => {
          this.problemCause = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      this.hseAuditTopic = this.rowData.auditTopic.split(",");
      this.hseAuditTopic = this.hseAuditTopic.map((item) => {
        return {
          evalueItem: item,
          hseAuditSystemCode: "",
        };
      });
      GetHSEAuditGroupTopic({ type: this.rowData.groupType }).then((res) => {
        res.data.map((item) => {
          this.hseAuditTopic.map((topic) => {
            if (topic.evalueItem == item.evalueItem) {
              topic.hseAuditSystemCode = item.hseAuditSystemCode;
            }
          });
        });
      });
      GetHSEAuditGroupMember()
        .then((res) => {
          this.employees = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      GetCompany()
        .then((res) => {
          this.companytree = res.data;
        })
        .catch(() => {
          this.$message.error("获取审核区域失败！");
        });
    },
    getHseTopic() {
      this.hseAuditGroupForm.hseAuditTopicItem = "";
      GetHseAuditTopicItem(
        this.hseAuditGroupForm.hseAuditTopic.hseAuditSystemCode
      )
        .then((res) => {
          this.hseAuditTopicItem = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },
    getAuditTopicItem() {
      this.hseAuditProblemForm.auditItem = this.hseAuditGroupForm.hseAuditTopicItem.evalueItem;
      GetHSEAuditSystem(
        this.hseAuditGroupForm.hseAuditTopicItem.hseAuditSystemCode,
        { status: this.hseAuditGroupForm.hseAuditTopicItem.type }
      ).then((res) => {
        this.hseAuditSystem = res.data[0].children[0].hseAuditSystemCode;
        this.type = res.data[0].type;
      });
    },
    getHseAuditSystem(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.hiddenHseAuditSystem = false;
          GetHSEAuditSystem(
            this.hseAuditGroupForm.hseAuditTopicItem.hseAuditSystemCode,
            { status: this.hseAuditGroupForm.hseAuditTopicItem.type }
          )
            .then((res) => {
              this.hseAuditSystemContent = res.data[0].children;
              this.type = res.data[0].type;
              this.getHseAuditContent();
            })
            .catch((err) => {
              this.$message.error(err.message);
            });
        } else {
          return false;
        }
      });
      this.getEntriedData();
    },
    returnIndex() {
      this.$router.replace("/hseAudit/hseProblemEntry/index");
    },
    getHseAuditContent() {
      this.hseAuditSystemContent.map((item) => {
        if (item.hseAuditSystemCode == this.hseAuditSystem) {
          this.hseAuditProblemForm.auditContent = item.evalueItem;
          this.hseAuditTopicTable = item.children;
        }
      });
    },
    handleSelectCompany(val) {
      this.companyData = val;
      console.log(val);
    },
    handleEntry(row) {
      this.hseAuditProblemForm.auditGroupID = this.rowData.auditGroupID
      this.hseAuditProblemForm.auditGroupName = this.rowData.auditGroupName
      this.hseAuditProblemForm.auditTime = this.hseAuditGroupForm.hseAuditDate;
      this.hseAuditProblemForm.auditSubject = this.hseAuditGroupForm.hseAuditTopic.evalueItem;
      this.hseAuditProblemForm.auditItem = this.hseAuditGroupForm.hseAuditTopicItem.evalueItem;
      this.hseAuditProblemForm.companyName = this.companyData.label;
      this.hseAuditProblemForm.companyCode = this.companyData.id;
      this.hseAuditProblemForm.qhseeManagementFactorCode = row.qHSEESystemCode;
      this.getHseAuditContent();
      this.hseAuditProblemForm.elementsInvolved = row.allSystem;
      this.hseAuditProblemForm.qhseeManagementFactor = row.qHSEESystemItem;
      this.hseAuditProblemForm.judgmentBasis = row.evalueDescritption;
      this.hseAuditProblemForm.scoringItems = row.evalueItem;
      this.hseAuditProblemForm.internalAuditorID = this.rowData.groupLeaderID;
      this.hseAuditProblemForm.internalAuditorName = this.rowData.groupLeaderName;
      this.hseAuditProblemForm.round = this.rowData.round;
      this.hseAuditProblemForm.companyCode = this.hseAuditGroupForm.hseAuditCompany;
      this.hseAuditProblemForm.classify = this.type;
      GetLoginPerson()
        .then((res) => {
          this.hseAuditProblemForm.checkerID = res.data.employeeID;
          this.hseAuditProblemForm.checkerName = res.data.name;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      this.hseAuditProblemForm.recordStatus = "未审核";
      this.entryDialogVisible = true;
    },
    // getCompany(value) {
    //     this.hseAuditProblemForm.companyCode = value.companyCode
    //     this.hseAuditProblemForm.companyName = value.companyName
    // },
    getresponsePerson(value) {
      this.hseAuditProblemForm.responsePersonID = value.employeeID;
      this.hseAuditProblemForm.responsePersonName = value.name;
    },
    getRectPerson(value) {
      this.hseAuditProblemForm.rectPersonID = value.employeeID;
      this.hseAuditProblemForm.rectPersonName = value.name;
    },
    beforeAttachUpload(file) {
      let size = file.size / 1024 / 1024 / 12;
      if (size > 1) {
        this.$message.error("上传文件大小不能超过12MB！");
      }
    },
    changeResponsePerson(value) {
      this.examineForm.responsePersonID = value.employeeID;
      this.examineForm.responsePersonName = value.name;
    },
    changeRectPerson(value) {
      this.examineForm.rectPersonID = value.employeeID;
      this.examineForm.rectPersonName = value.name;
    },
    handleRemoveCheckAttach(file, fileList) {
      this.checkAttachFileList = fileList;
    },
    handleRemoveUpdateCheckAttach(file, fileList) {
      this.updateCheckAttachFileList = fileList;
    },
    handleSuccessCheckAttach(response, file, fileList) {
      if (response) {
        this.$notify.success({
          body: {
            style: { width: "300px", height: "500px" },
          },
          title: "提示",
          message: "文件上传成功",
        });
        this.checkAttachFileList = fileList;
      }
    },
    updateSuccessCheckAttach(response, file, fileList) {
      if (response) {
        this.$notify.success({
          body: {
            style: { width: "300px", height: "500px" },
          },
          title: "提示",
          message: "文件上传成功",
        });
      }
      this.updateCheckAttachFileList = fileList;
    },
    getCheckAttachFileList(form, fileList) {
      for (var i in fileList) {
        if (i == 0) {
          form.checkAttach1 = UploadURL + fileList[i].response.data;
          form.checkAttach2 = "";
          form.checkAttach3 = "";
          form.checkAttach4 = "";
        } else if (i == 1) {
          form.checkAttach2 = UploadURL + fileList[i].response.data;
          form.checkAttach3 = "";
          form.checkAttach4 = "";
        } else if (i == 2) {
          form.checkAttach3 = UploadURL + fileList[i].response.data;
          form.checkAttach4 = "";
        } else {
          form.checkAttach4 = UploadURL + fileList[i].response.data;
        }
      }
    },
    handleRemoveCheckVideo() {
      this.checkVideoUrl = "";
      this.hseAuditProblemForm.checkVideo = "";
    },
    handleSuccessCheckVideo(response, file) {
      if (response) {
        this.$notify.success({
          body: {
            style: { width: "300px", height: "500px" },
          },
          title: "提示",
          message: "问题视频上传成功",
        });
        this.hseAuditProblemForm.checkVideo = UploadURL + response.data;
        this.checkVideoUrl = URL.createObjectURL(file.raw);
      }
    },
    handleAddRecord() {
      this.getCheckAttachFileList(
        this.hseAuditProblemForm,
        this.checkAttachFileList
      );
      this.$refs.hseAuditProblemFormRef.validate((valid) => {
        if (valid) {
          AddHSECheckRecord(this.hseAuditProblemForm)
            .then(() => {
              this.$message.success("录入问题成功！");
              this.$refs.upload.clearFiles();
              this.checkVideoUrl = "";
              this.checkAttachFileList = [];
              this.entryDialogVisible = false;
              this.hseAuditProblemForm = {};
              this.getEntriedData();
            })
            .catch((err) => {
              this.$message.error(err.message);
            });
        }
      });
    },
    resetForm() {
      this.$refs.hseAuditProblemFormRef.resetFields();
      this.$refs.examineFormRef.resetFields();
    },
    getEntriedData() {
      this.subjectData.auditSubject = this.hseAuditGroupForm.hseAuditTopic.evalueItem;
      this.subjectData.auditItem = this.hseAuditGroupForm.hseAuditTopicItem.evalueItem;
      this.subjectData.auditTime = this.hseAuditGroupForm.hseAuditDate;
      this.subjectData.companyCode = this.hseAuditGroupForm.hseAuditCompany;
      this.entriedTableData = [];
      GetAuditSubjectRecord(this.subjectData)
        .then((res) => {
          res.data.map((item) => {
            if (item.status == "暂存") {
              this.entriedTableData.push(item);
            }
          });
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },
    updateResponsePerson(value) {
      this.examineForm.responsePersonID = value.employeeID;
      this.examineForm.responsePersonName = value.name;
    },
    updateRectPerson(value) {
      this.examineForm.rectPersonID = value.employeeID;
      this.examineForm.rectPersonName = value.name;
    },
    handleExamine(row) {
      this.updateCheckAttachFileList = [];
      this.examineForm = row;
      this.handleCheckFile(this.examineForm.checkAttach1);
      this.handleCheckFile(this.examineForm.checkAttach2);
      this.handleCheckFile(this.examineForm.checkAttach3);
      this.handleCheckFile(this.examineForm.checkAttach4);
      this.examineVisibleDialog = true;
    },
    handleCheckFile(checkAttach) {
      if (checkAttach != null && checkAttach != "") {
        this.updateCheckAttachFileList.push({
          url: checkAttach,
        });
      }
    },
    handleDelete(row) {
      this.$confirm("此操作将永久删除文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        callback: (action) => {
          if (action == "confirm") {
            DeleteCheckRecord(row)
              .then(() => {
                this.$message.success("删除成功");
                this.getEntriedData();
              })
              .catch((err) => {
                this.$message.error(err.message);
              });
          } else {
            this.$message.info("已取消删除");
          }
        },
      });
    },
    updateProblem() {
      if (this.updateCheckAttachFileList.length != 0) {
        for (var i in this.updateCheckAttachFileList) {
          if (i == 0) {
            if (this.updateCheckAttachFileList[0].url.indexOf("http") !== -1) {
              this.examineForm.checkAttach1 = this.updateCheckAttachFileList[0].url;
            } else {
              this.examineForm.checkAttach1 =
                UploadURL + this.updateCheckAttachFileList[0].url;
            }
          } else if (i == 1) {
            if (this.updateCheckAttachFileList[1].url.indexOf("http") !== -1) {
              this.examineForm.checkAttach2 = this.updateCheckAttachFileList[1].url;
            } else {
              this.examineForm.checkAttach2 =
                UploadURL + this.updateCheckAttachFileList[1].url;
            }
          } else if (i == 2) {
            if (this.updateCheckAttachFileList[2].url.indexOf("http") !== -1) {
              this.examineForm.checkAttach3 = this.updateCheckAttachFileList[2].url;
            } else {
              this.examineForm.checkAttach3 =
                UploadURL + this.updateCheckAttachFileList[2].url;
            }
          } else {
            if (this.updateCheckAttachFileList[3].url.indexOf("http") !== -1) {
              this.examineForm.checkAttach4 = this.updateCheckAttachFileList[3].url;
            } else {
              this.examineForm.checkAttach4 =
                UploadURL + this.updateCheckAttachFileList[3].url;
            }
          }
        }
        this.submitUpdate();
      } else {
        this.examineForm.checkAttach1 = " ";
        this.examineForm.checkAttach2 = " ";
        this.examineForm.checkAttach3 = " ";
        this.examineForm.checkAttach4 = " ";
        this.submitUpdate();
      }
    },
    submitUpdate() {
      this.$refs.examineFormRef.validate((valid) => {
        if (valid) {
          UpdateHSECheckRecord(this.examineForm)
            .then(() => {
              this.$message.success("修改成功！");
              this.examineVisibleDialog = false;
              this.getEntriedData();
            })
            .catch((err) => {
              this.$message.error(err.message);
            });
        }
      });
    },
    UpdateRemoveCheckVideo() {
      this.examineForm.checkVideo = "";
      this.updateCheckVideoUrl = "";
    },
    UpdateSuccessCheckVideo(response, file) {
      if (response) {
        this.$notify.success({
          body: {
            style: { width: "300px", height: "500px" },
          },
          title: "提示",
          message: "问题视频上传成功",
        });
        this.examineForm.checkVideo = UploadURL + response.data;
        this.updateCheckVideoUrl = URL.createObjectURL(file.raw);
      }
    },
    hanleSubmit() {
      this.entriedTableData.map((item) => {
        this.submitTable.push(item.qhseeCheckRecordID);
      });
      this.$confirm("此操作将提交所有数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        callback: (action) => {
          if (action == "confirm") {
            this.submitTable = this.submitTable.join(",");
            SubmitHSEEntried({ ids: this.submitTable }).then(() => {
              this.$message.success("批量提交成功！");
              this.getEntriedData();
            });
          } else {
            this.$message.info("已取消提交");
          }
        },
      });
    },
  },
};
</script>

<style>
.el-table th {
  display: table-cell !important;
}

</style>